{% extends 'bootstrap/base.html' %}
{% import 'bootstrap/wtf.html' as wtf %}{# 渲染表单，这里导入后子文件里无需再导入 #}
{% block head %}
    {{ super() }}
    {# 加载收藏夹和标签页的图标。静态文件应放在static文件夹内，是Flask的__init__()规定的，可点击Flask查看。static是系统级路由，视图函数名是static #}
    <link rel="icon" type="image/x-icon" href="{{ url_for('static',filename='favicon/favicon.ico') }}" /><!--讲加载图标时写的-->
    <!--下面7行是图片转icon的网站说要加的-->
    <link rel="apple-touch-icon" sizes="180x180" href="{{ url_for('static',filename='favicon/apple-touch-icon.png') }}">
    <link rel="icon" type="image/png" sizes="32x32" href="{{ url_for('static',filename='favicon/favicon-32x32.png') }}">
    <link rel="icon" type="image/png" sizes="16x16" href="{{ url_for('static',filename='favicon/favicon-16x16.png') }}">
    <link rel="manifest" href="{{ url_for('static',filename='favicon/site.webmanifest') }}">
    <link rel="mask-icon" href="{{ url_for('static',filename='favicon/safari-pinned-tab.svg') }}" color="#5bbad5">
    <meta name="msapplication-TileColor" content="#da532c">
    <meta name="theme-color" content="#ffffff">
{% endblock %}
{% block title %}项目的父级模板的标题{% endblock %}
{% block navbar %}
<!--导航条代码是复制bootstrap官网的，https://v3.bootcss.com/components/#navbar，但手动修改了以下内容:
添加了style为直角；
修改container-fluid为container(含后面的注释)；
修改右上角Link为登录，并添加注册标签；
删除右上角下拉菜单；
删除左上角默认激活的Link；
修改左上角Brand为首页；
修改左上角Link为版块一，并添加所有文章；
搜索栏后添加两个写博客；
判断当前用户是否已登录里，已登录时添加下拉菜单，代码也是导航条里复制的；
修改左上方下拉菜单内容-->
<nav class="navbar navbar-default" style="border-radius:0px;">
  <div class="container">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="{{ url_for('main.index') }}">首页</a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li><a href="#">版块一</a></li>
        <li><a href="{{ url_for('article.all_article') }}">所有文章</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">文章类型<span class="caret"></span></a>
          <ul class="dropdown-menu">
            <li><a href="{{ url_for('article.search_by_type') }}?type_id=1">编程</a></li>
            <li role="separator" class="divider"></li>
            <li><a href="{{ url_for('article.search_by_type') }}?type_id=2">杀软</a>
            <li role="separator" class="divider"></li>
            <li><a href="{{ url_for('article.search_by_type') }}?type_id=3">逆向</a></li>
            <li role="separator" class="divider"></li>
            <li><a href="{{ url_for('article.search_by_type') }}?type_id=4">网安</a></li>
          </ul>
        </li>
        <li><a href="{{ url_for('article.publish_article1') }}">写博客</a></li>
        <li><a href="{{ url_for('article.publish_article2') }}">写博客(富文本)</a></li>
      </ul>
      <form class="navbar-form navbar-left">
        <div class="form-group">
          <input type="text" class="form-control" placeholder="Search">
        </div>
        <button type="submit" class="btn btn-default">搜索</button>
      </form>
        <ul class="nav navbar-nav navbar-right">
            {% if current_user.is_authenticated %}{# 判断当前用户是否已登录，current_user在user.py中，is_authenticated在models.py中点UserMixin查看。不用Flask_Login时这行写if session['username'] #}
                {# <li><a href="#">{{ current_user.username }}</a></li><!--不用Flask_Login时这里写session['username']--> #}{# 这一行改成了下一行的下拉菜单 #}
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
                       aria-expanded="false">{{ current_user.username }}<span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="{{ url_for('user.profile') }}">个人信息</a></li>
                        <li><a href="{{ url_for('user.modify_password') }}">修改密码</a></li>
                        <li><a href="{{ url_for('user.modify_email') }}">修改邮箱</a></li>
                    </ul>
                </li>
                <li><a href="{{ url_for('user.logout') }}">退出</a></li>
            {% else %}
                <li><a href="{{ url_for('user.login') }}"><!--动态地根据函数名反向构造出真实路由地址-->登录</a></li>
                <li><a href="{{ url_for('user.register') }}"><!--url_for()里写蓝本名.视图函数名。只写.视图函数名表示加载当前文件的蓝本-->注册</a></li>
            {% endif %}
        </ul>
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container -->
</nav>
{% endblock %}
{% block content %}
    <div class="container">
        {% for i in get_flashed_messages() %}{# for循环内是复制bootstrap的代码，https://v3.bootcss.com/components/#alerts-dismissible #}
            <div class="alert alert-warning alert-dismissible" role="alert">
                <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span
                        aria-hidden="true">&times;</span></button>
                {{ i }}
            </div>
        {% endfor %}
        {% block page_content %}默认内容{# 设置block使子文件通过同名block方便地修改此处内容 #}{% endblock %}
    </div>
{% endblock %}
{% block scripts %}
    {{ super() }}
    {# 这里添加moment时，profile.html已经写好了，里面的注册时间没用moment显示。展示已发布的文章时在这里添加的moment，那里用了 #}
    {{ moment.include_moment(local_js="https://cdn.bootcdn.net/ajax/libs/moment.js/2.29.1/moment-with-locales.min.js") }}{# 用cdn加载moment.js(因默认源链接可能加载很慢或加载失败)，依赖jQuery。bootstrap也依赖jQuery，所以不用手动加载jQuery #}
    {{ moment.locale('zh-CN') }}{# 设置语言为中文 #}
{% endblock %}